{extend name="base" /}

{block name="content"}

<div class="g-main">

    <div class="m-main-title">

        <div class="m-container-fluid">

            <a href="{:url('index/welcome')}"><i class="icon icon-home"></i>首页</a>

            <span class="icon-angle-right"></span>

            <span>商城</span>

            <span class="icon-angle-right"></span>

            <span>邮费管理</span>

            <span class="icon-angle-right"></span>

            <span>{$info ? '编辑' : '添加'}邮费模板</span>

            <a class="u-flush"><i class="icon-repeat"></i></a>

        </div>

    </div>

    <div class="m-main-content">

        <div class="m-container">

            <div class="m-form">

                <form class="layui-form" id="j_form">

                    <table class="m-table">

                        <thead>

                            <tr>

                                <th colspan="2">{$info ? '编辑' : '添加'}邮费模板</th>

                            </tr>

                        </thead>

                        <tbody>

						<tr>
							<td width="15%"><label for="name">名称<em>*</em></label></td>
							<td><input type="text" class="u-ipt u-ipt-long" name="name" id="name" placeholder="请输入名称" value="{$info.name}" /></td>
						</tr>
                            <tr>
                                <td width="15%"><label for="title">基础费用<em>*</em></label></td>
                                <td><input type="num" class="u-ipt u-ipt-long" name="postage_amount" id="postage_amount" placeholder="请输入邮费" value="{$info.postage_amount}" /></td>
                            </tr>
                            <tr>
                                <td><label for="">类型<em>*</em></label></td>
                                <td>
                                    <div class="lay-select">
                                        <select id="type" name="type" lay-filter="type">
                                            <option  value="1" {if condition="$info['type'] eq 1"} selected{/if}>固定收费</option>
                                            <option  value="2" {if condition="$info['type'] eq 2"} selected{/if}>计重</option>
                                            <option  value="3" {if condition="$info['type'] eq 3"} selected{/if}>计件</option>
                                            <option  value="4" {if condition="$info['type'] eq 4"} selected{/if}>特殊地区</option>
                                        </select>
                                    </div>
                                </td>
                            </tr>
                            <tr id="sz">
                                <td><label for="url">首重<em>*</em></label></td>
                                <td><input type="text" class="u-ipt u-ipt-long" name="weight" id="weight" placeholder="重量" value="{$info.weight}" /><span>kg</span></td>
                            </tr>
							<tr id="cz">
								<td><label for="url">超重费用<em>*</em></label></td>
								<td><input type="num" class="u-ipt u-ipt-long" name="weight_amount" id="weight_amount" placeholder="请输入金额" value="{$info.weight_amount}" /><span>/kg</span></td>
							</tr>
							<tr>
								<td><label for="reduction_amount">包邮条件<em>*</em></label></td>
								<td><input type="num" class="u-ipt u-ipt-long" name="reduction_amount" id="reduction_amount" placeholder="请输入" value="{$info.reduction_amount}" /><span>到达此金额将包邮,0元代表不包邮</span></td>
							</tr>
							<tr id="dq">
								<td width="15%"><label for="">地区选择</label></td>
								<td>
									<div class="privilege-item lay-checked clearfix" style="margin-bottom: 0px;padding:0;border-bottom:none">
										<dl class="clearfix" style="border-bottom:none" id="xuanzhongs">
											<dt><h3 class="lay-checkbox"><input type="checkbox" class="select_item_all" lay-skin="primary" title="全选" lay-filter="h3_privilege" /></h3></dt>
											{foreach name="zoning" key="key1" item="nav"}
											<dd class="lay-checkbox"><input type="checkbox" name="area[]" id="area" lay-skin="primary" title="{$nav.region_name}" value="{$nav.region_id}" {if condition="!empty($info['area']) && in_array($nav['region_id'], $info['area'])"} checked{/if}/></dd>
											{/foreach}
										</dl>
									</div>
								</td>
							</tr>

                            <tr>

                                <td><label for="list_order">排序</label></td>

                                <td><input type="text" class="u-ipt u-ipt-small" name="list_order" id="list_order" placeholder="请输入排序值" value="{$info.list_order ?: 0}" /><span>值越大越排在前面</span></td>

                            </tr>

                        </tbody>

                    </table>

                    <div class="m-form-btn"><input type="hidden" name="id" value="{$info.id}"><button id="j_btn" class="u-btn">确定提交</button></div>

                </form>

            </div>

        </div>

    </div>

</div>

{/block}

{block name="extrajs"}
<script src="__STATIC__/public/js/jquery-ui.min.js"></script>
<script>
    $(function () {
        var keyValue;
        keyValue = $('#type :selected ').val();



        if (keyValue == 1) {
            $("#sz").hide();
            $("#cz").hide();
            $("#dq").hide();
        }
        if (keyValue == 2) {
            $("#sz").show();
            $("#cz").show();
            $("#dq").hide();
        }
        if (keyValue == 3) {
            $("#sz").hide();
            $("#cz").hide();
            $("#dq").hide();
        }
        if (keyValue == 4) {
            $("#sz").hide();
            $("#cz").hide();
            $("#dq").show();
        }

    })
    layui.use('form', function () {
        var form = layui.form;
        form.on('select(type)', function (data) {
            console.log(data);
            if (data.value == 1) {
                $("#sz").hide();
                $("#cz").hide();
                $("#dq").hide();
            }
            if (data.value  == 2) {
                $("#sz").show();
                $("#cz").show();
                $("#dq").hide();
            }
            if (data.value  == 3) {
                $("#sz").hide();
                $("#cz").hide();
                $("#dq").hide();
            }
            if (data.value  == 4) {
                $("#sz").hide();
                $("#cz").hide();
                $("#dq").show();
            }
            form.render();
        });

    });



</script>
{/block}
